import React, { Suspense } from 'react';
import Loadable from 'react-loadable';
import LoadingProgress from '../components/LoadingProgress';

export const lazyLoad = (importFunc: () => Promise<any>, tip?: string) => {
  return Loadable({
    loader: importFunc,
    loading: () => <LoadingProgress tip={tip} />,
    delay: 300, // 延迟显示加载组件，避免闪烁
  });
};

// 使用 React.lazy 的版本（推荐）
export const lazyLoadWithSuspense = (importFunc: () => Promise<any>, tip?: string) => {
  const LazyComponent = React.lazy(importFunc);

  return (props: any) => (
    <Suspense fallback={<LoadingProgress tip={tip} />}>
      <LazyComponent {...props} />
    </Suspense>
  );
};
